
<!--
 * @version: 
 * @Author: yu
 * @Date: 2023-07-06 18:11:03
 * @LastEditors: Andy
 * @LastEditTime: 2023-07-12 11:08:18
-->
<template>
    <div>
        <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item><a href="#">{{ route.name }}</a></el-breadcrumb-item>
        </el-breadcrumb>
        <el-button type="primary" @click="add">添加</el-button>

        <v-dialog ref="dialog" :isShow="isShow" :isAdd="isAdd" @cancel="cancel"></v-dialog>


        <list @edit="edit"></list>

    </div>
</template>
<script setup>
import vDialog from './dialog.vue'
import list from './list.vue'
import { useRoute, useRouter, currentRoute } from 'vue-router'
import { onMounted, ref } from 'vue';
const route = useRoute()
const router = useRouter()

const isShow = ref(false)   //定义弹窗
const isAdd = ref(true)     //true是添加

const dialog = ref()

//添加
const add = () => {
    isShow.value = true
    isAdd.value = true
}

//取消
const cancel = (e) => {
    isShow.value = e
}

//编辑
const edit = (id) =>{
    // console.log(id);
    isShow.value = true
    isAdd.value = false
    dialog.value.getDetail(id)
}

onMounted(() => {
    document.title = router.currentRoute.value.meta.title
})


</script>
<style scoped>
.el-button {
    margin-top: 20px;
    margin-bottom: 15px;
}
</style>